<template>
    <div>
        <a-tooltip placement="right">
            <template #title>
                <span>
                    {{ title }}
                </span>
            </template>
            <div class="ml-flex">
                <slot></slot>
            </div>
        </a-tooltip>
    </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";

export default defineComponent({
    props: {
        title: String,
    },
});
</script>

<style lang="less" scoped>
.ml-flex {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    cursor: pointer;
    user-select: none;
}
</style>
